<template>
	<view class="ys">
		<view class="xz fl">
			<view class="xzitem" :class="{se:acvite==index}" v-for="(item,index) in mc" :key="index" @tap="bian(index)">
				<text>{{item.text}}</text>
				<view class="di" v-show="acvite==index">
				
			</view>
			</view>
			
		</view>
	</view>
</template>

<script>
	export default{
		data(){
			return{
			acvite:0,
				mc:[
					{id:0,text:'免密登录'},
					{id:1,text:'账号登录'},
				]
			}
			
		},
		methods:{
			bian(val){
				this.acvite=val
			}
		}
		
	}
</script>

<style lang="scss" scoped>
	.xz{
		justify-content: center;
		.xzitem{
			margin: 40rpx  80rpx;
			position: relative;
			.di{
				width: 100rpx;
				height: 6rpx;
				background-color: #0096e5;
				position: absolute;
				bottom: -20rpx;
				left: 10rpx;
				
			}
			
		}
		.se{
			color: #0096e5;
		}
	}
</style>